import request from '@/utils/request'

// 设备ID

export const getMachineAllListDiewa = () => {
  return request({
    url: '/parameter/getMachineGroupByMachineTypeId/?machineType=叠瓦',
    method: 'get'
  })
}

// 查询列表
export const queryTableData = (query:any) => {
  return request({
    url: '/report/kpi/machineAlarmDetailList',
    method: 'get',
    params: query
  })
}

type Obj = Record<string, any>

export const getColumns = (data:Obj, tempAgv:Obj, tempCount:any[], tempTime:Obj) => {
  let temp:Obj = data[0]
  let _maxTempCount = Math.max.apply(null, tempCount)

  const cellStyle = ({ colDef, data, value }:Obj) => {
    if(value/_maxTempCount < 0.2){
      return {
        background: '#63be7b'
      }
    }

    if(value/_maxTempCount >= 0.2 && value/_maxTempCount < 0.4){
      return {
        background: '#c0d980'
      }
    }

    if(value/_maxTempCount >= 0.4 && value/_maxTempCount < 0.6){
      return {
        background: '#fff'
      }
    }

    if(value/_maxTempCount >= 0.6 && value/_maxTempCount < 0.8){
      return {
        background: '#fdb87b'
      }
    }

    if(value/_maxTempCount >= 0.8 && value/_maxTempCount <= 1){
      return {
        background: '#f8696b'
      }
    }
  }
  return [
    { headerName: "厂商", field: "manufacturer", width: 80 },
    { headerName: "设备类型", field: "sourceMachineType", width: 55 },
    { headerName: "报警号", field: "alarmId", width: 55 },
    { headerName: "报警文本", field: "alarmTxt", minWidth: 200, flex: 1, tooltipField:'alarmTxt' },
    {
      headerName: "平均时长",
      children: [
        { headerName: temp.agv1.split('_')[0], field: 'agv1', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempAgv[0]) * 60}px; height: 30px">
                    </div>
                  </div>`
                  // <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempAgv[5]) * 60}px; height: 30px"> // 将 一列值全为 0 的单元格不要渲染颜色
        } },
        { headerName: temp.agv2.split('_')[0], field: 'agv2', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempAgv[1]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.agv3.split('_')[0], field: 'agv3', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempAgv[2]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.agv4.split('_')[0], field: 'agv4', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempAgv[3]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.agv5.split('_')[0], field: 'agv5', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempAgv[4]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.agv6.split('_')[0], field: 'agv6', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempAgv[5]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.agv7.split('_')[0], field: 'agv7', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempAgv[6]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.agv8.split('_')[0], field: 'agv8', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempAgv[7]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } }
      ]
    },

    {
      headerName: `发生次数（最大${_maxTempCount}次）`,
      headerClass: 'custom-rate',
      children: [
        { headerName: temp.count1.split('_')[0], field: 'count1', width: 60, headerClass: 'custom-rate', cellStyle },
        { headerName: temp.count2.split('_')[0], field: 'count2', width: 60, headerClass: 'custom-rate', cellStyle },
        { headerName: temp.count3.split('_')[0], field: 'count3', width: 60, headerClass: 'custom-rate', cellStyle },
        { headerName: temp.count4.split('_')[0], field: 'count4', width: 60, headerClass: 'custom-rate', cellStyle },
        { headerName: temp.count5.split('_')[0], field: 'count5', width: 60, headerClass: 'custom-rate', cellStyle },
        { headerName: temp.count6.split('_')[0], field: 'count6', width: 60, headerClass: 'custom-rate', cellStyle },
        { headerName: temp.count7.split('_')[0], field: 'count7', width: 60, headerClass: 'custom-rate', cellStyle },
        { headerName: temp.count8.split('_')[0], field: 'count8', width: 60, headerClass: 'custom-rate', cellStyle }
      ]
    },

    {
      headerName: "累计时间",
      children: [
        { headerName: temp.time1.split('_')[0], field: 'time1', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempTime[0]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.time2.split('_')[0], field: 'time2', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempTime[1]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.time3.split('_')[0], field: 'time3', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempTime[2]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.time4.split('_')[0], field: 'time4', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempTime[3]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.time5.split('_')[0], field: 'time5', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempTime[4]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.time6.split('_')[0], field: 'time6', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempTime[5]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.time7.split('_')[0], field: 'time7', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempTime[6]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } },
        { headerName: temp.time8.split('_')[0], field: 'time8', width: 60, cellRenderer: (params:any) => {
          return `<div style="width: 60px; margin-left: -2px;">
                    <p style="float: left; width: 60px; text-align: center;">${params.value}</p>
                    <div style="background: #fec87e; width: ${params.value === '0' ? '0' : (params.value / tempTime[7]) * 60}px; height: 30px">
                    </div>
                  </div>`
        } }
      ]
    }
  ]
}

export const getTableData = (data:any[]) => {
  let lockMapFirst = new Map([
    [1, ""],
    [2, "目标"],
    [3, "实绩"],
    [4, "差异"],
    [5, "激光"],
    [6, "印刷"],
    [7, "叠片"]
  ])

  let tableGroup:any = {
    'P': '小报警率(%)',
    'C': '小报警数(件)',
    'T': '小报警时(分)'
  }

  let targetData:Obj = {
  }
  let jump:any = null

  for(let key in data) {
    targetData[tableGroup[key]] = []

    data[key].forEach((item:any, index:number) => {
      if(index === 0){
        if(!jump){ jump = item }
      } else {
        index === 1 ? item.title = tableGroup[key] : item.title = lockMapFirst.get(index)
        targetData[tableGroup[key]].push(item)
      }

    })
  }

  return {
    targetData,
    jump
  }
}